.animation-view {
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	-o-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-fill-mode:forwards;
	-moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-delay:0s;
	-moz-animation-delay:0s;
	-o-animation-delay:0s;
	animation-delay:0s;
}

/* 淡入
****************************************************************************************/
@-webkit-keyframes fadeIn {
	0% {
	opacity:0
	}
	100% {
	opacity:1
	}
}
@-moz-keyframes fadeIn {
	0% {
	opacity:0
	}
	100% {
	opacity:1
	}
}
@-o-keyframes fadeIn {
	0% {
	opacity:0
	}
	100% {
	opacity:1
	}
}
@keyframes fadeIn {
	0% {
	opacity:0
	}
	100% {
	opacity:1
	}
}
.animation-view.animation-fade-in{
	opacity:0;
}
.animation-view.fadeIn {
	-webkit-animation-name:fadeIn;
	-moz-animation-name:fadeIn;
	-o-animation-name:fadeIn;
	animation-name:fadeIn;
}
/* 从下滑入
****************************************************************************************/
@-webkit-keyframes fadeInDown {
	0% {
		opacity:0;
		-webkit-transform:translateY(20px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateY(0)
	}
}
@-moz-keyframes fadeInDown {
	0% {
		opacity:0;
		-moz-transform:translateY(20px)
	}
	100% {
		opacity:1;
		-moz-transform:translateY(0)
	}
}
@-o-keyframes fadeInDown {
	0% {
		opacity:0;
		-o-transform:translateY(20px)
	}
	100% {
		opacity:1;
		-o-transform:translateY(0)
	}
}
@keyframes fadeInDown {
	0% {
		opacity:0;
		transform:translateY(20px)
	}
	100% {
		opacity:1;
		transform:translateY(0)
	}
}
.animation-view.animation-fade-in-down{
	opacity:0;
	-webkit-transform:translateY(20px);
	-moz-transform:translateY(20px);
	-o-transform:translateY(20px);
	transform:translateY(20px);
}
.animation-view.fadeInDown {
	-webkit-animation-name:fadeInDown;
	-moz-animation-name:fadeInDown;
	-o-animation-name:fadeInDown;
	animation-name:fadeInDown;
}

/* 从左滑入
****************************************************************************************/
@-webkit-keyframes fadeInLeft {
	0% {
		opacity:0;
		-webkit-transform:translateX(-20px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateX(0)
	}
}
@-moz-keyframes fadeInLeft {
	0% {
		opacity:0;
		-moz-transform:translateX(-20px)
	}
	100% {
		opacity:1;
		-moz-transform:translateX(0)
	}
}
@-o-keyframes fadeInLeft {
	0% {
	opacity:0;
	-o-transform:translateX(-20px)
	}
	100% {
	opacity:1;
	-o-transform:translateX(0)
	}
}
@keyframes fadeInLeft {
	0% {
	opacity:0;
	transform:translateX(-20px)
	}
	100% {
	opacity:1;
	transform:translateX(0)
	}
}
.animation-view.animation-fade-in-left{
	opacity:0;
	-webkit-transform:translateX(-20px);
	-moz-transform:translateX(-20px);
	-o-transform:translateX(-20px);
	transform:translateX(-20px);
}
.animation-view.fadeInLeft {
	-webkit-animation-name:fadeInLeft;
	-moz-animation-name:fadeInLeft;
	-o-animation-name:fadeInLeft;
	animation-name:fadeInLeft;
}

/* 从右滑入
****************************************************************************************/
@-webkit-keyframes fadeInRight {
	0% {
	opacity:0;
	-webkit-transform:translateX(20px)
	}
	100% {
	opacity:1;
	-webkit-transform:translateX(0)
	}
}
@-moz-keyframes fadeInRight {
	0% {
	opacity:0;
	-moz-transform:translateX(20px)
	}
	100% {
	opacity:1;
	-moz-transform:translateX(0)
	}
}
@-ms-keyframes fadeInRight {
	0% {
	opacity:0;
	-ms-transform:translateX(20px)
	}
	100% {
	opacity:1;
	-ms-transform:translateX(0)
	}
}
@-o-keyframes fadeInRight {
	0% {
	opacity:0;
	-o-transform:translateX(20px)
	}
	100% {
	opacity:1;
	-o-transform:translateX(0)
	}
}
@keyframes fadeInRight {
	0% {
	opacity:0;
	transform:translateX(20px)
	}
	100% {
	opacity:1;
	transform:translateX(0)
	}
}
.animation-view.animation-fade-in-right{
	opacity:0;
	-webkit-transform:translateX(20px);
	-moz-transform:translateX(20px);
	-o-transform:translateX(20px);
	transform:translateX(20px);
}
.animation-view.fadeInRight {
	-webkit-animation-name:fadeInRight;
	-moz-animation-name:fadeInRight;
	-o-animation-name:fadeInRight;
	animation-name:fadeInRight;
}

/* 淡出
****************************************************************************************/
@-webkit-keyframes fadeOut {
	0% {
	opacity:1
	}
	100% {
	opacity:0
	}
}
@-moz-keyframes fadeOut {
	0% {
	opacity:1
	}
	100% {
	opacity:0
	}
}
@-o-keyframes fadeOut {
	0% {
	opacity:1
	}
	100% {
	opacity:0
	}
}
@keyframes fadeOut {
	0% {
	opacity:1
	}
	100% {
	opacity:0
	}
}
.animation-view.animation-fade-out{
	opacity:1;
}
.animation-view.fadeOut {
	-webkit-animation-name:fadeOut;
	-moz-animation-name:fadeOut;
	-o-animation-name:fadeOut;
	animation-name:fadeOut;
}

/* 往下滑出
****************************************************************************************/
@-webkit-keyframes fadeOutDown {
	0% {
	opacity:1;
	-webkit-transform:translateY(0)
	}
	100% {
	opacity:0;
	-webkit-transform:translateY(20px)
	}
}
@-moz-keyframes fadeOutDown {
	0% {
	opacity:1;
	-moz-transform:translateY(0)
	}
	100% {
	opacity:0;
	-moz-transform:translateY(20px)
	}
}
@-o-keyframes fadeOutDown {
	0% {
	opacity:1;
	-o-transform:translateY(0)
	}
	100% {
	opacity:0;
	-o-transform:translateY(20px)
	}
}
@keyframes fadeOutDown {
	0% {
	opacity:1;
	transform:translateY(0)
	}
	100% {
	opacity:0;
	transform:translateY(20px)
	}
}
.animation-view.animation-fade-out-down{
	opacity:1;
	-webkit-transform:translateY(0px);
	-moz-transform:translateY(0px);
	-o-transform:translateY(0px);
	transform:translateY(0px);
}
.animation-view.fadeOutDown {
	-webkit-animation-name:fadeOutDown;
	-moz-animation-name:fadeOutDown;
	-o-animation-name:fadeOutDown;
	animation-name:fadeOutDown;
}
/* 往左滑出
**************************************************************************************************************************************/
@-webkit-keyframes fadeOutLeft {
	0% {
	opacity:1;
	-webkit-transform:translateX(0)
	}
	100% {
	opacity:0;
	-webkit-transform:translateX(-20px)
	}
}
@-moz-keyframes fadeOutLeft {
	0% {
	opacity:1;
	-moz-transform:translateX(0)
	}
	100% {
	opacity:0;
	-moz-transform:translateX(-20px)
	}
}
@-o-keyframes fadeOutLeft {
	0% {
	opacity:1;
	-o-transform:translateX(0)
	}
	100% {
	opacity:0;
	-o-transform:translateX(-20px)
	}
}
@keyframes fadeOutLeft {
	0% {
	opacity:1;
	transform:translateX(0)
	}
	100% {
	opacity:0;
	transform:translateX(-20px)
	}
}
.animation-view.animation-fade-out-left{
	opacity:1;
	-webkit-transform:translateX(0);
	-moz-transform:translateX(0);
	-o-transform:translateX(0);
	transform:translateX(0);
}
.animation-view.fadeOutLeft {
	-webkit-animation-name:fadeOutLeft;
	-moz-animation-name:fadeOutLeft;
	-o-animation-name:fadeOutLeft;
	animation-name:fadeOutLeft;
}

/* 往右滑出
**************************************************************************************************************************************/
@-webkit-keyframes fadeOutRight {
	0% {
	opacity:1;
	-webkit-transform:translateX(0)
	}
	100% {
	opacity:0;
	-webkit-transform:translateX(20px)
	}
}
@-moz-keyframes fadeOutRight {
	0% {
	opacity:1;
	-moz-transform:translateX(0)
	}
	100% {
	opacity:0;
	-moz-transform:translateX(20px)
	}
}
@-o-keyframes fadeOutRight {
	0% {
	opacity:1;
	-o-transform:translateX(0)
	}
	100% {
	opacity:0;
	-o-transform:translateX(20px)
	}
}
@keyframes fadeOutRight {
	0% {
	opacity:1;
	transform:translateX(0)
	}
	100% {
	opacity:0;
	transform:translateX(20px)
	}
}
.animation-view.animation-fade-out-right{
	opacity:1;
	-webkit-transform:translateX(0);
	-moz-transform:translateX(0);
	-o-transform:translateX(0);
	transform:translateX(0);
}
.animation-view.fadeOutRight {
	-webkit-animation-name:fadeOutRight;
	-moz-animation-name:fadeOutRight;
	-o-animation-name:fadeOutRight;
	animation-name:fadeOutRight;
}

/* 弹性缩放
**************************************************************************************************************************************/
@-webkit-keyframes pulse {
	0% {
	-webkit-transform:scale(1)
	}
	50% {
	-webkit-transform:scale(1.1)
	}
	100% {
	-webkit-transform:scale(1)
	}
}
@-moz-keyframes pulse {
	0% {
	-moz-transform:scale(1)
	}
	50% {
	-moz-transform:scale(1.1)
	}
	100% {
	-moz-transform:scale(1)
	}
}
@-o-keyframes pulse {
	0% {
	-o-transform:scale(1)
	}
	50% {
	-o-transform:scale(1.1)
	}
	100% {
	-o-transform:scale(1)
	}
}
@keyframes pulse {
	0% {
	transform:scale(1)
	}
	50% {
	transform:scale(1.1)
	}
	100% {
	transform:scale(1)
	}
}
.animation-view.pulse {
	-webkit-animation-name:pulse;
	-moz-animation-name:pulse;
	-o-animation-name:pulse;
	animation-name:pulse;
}
